<template>
	<view class="address-item-wrap-container">
		<view class="day-header-text">
			<view class="day-value">
				<text>Day{{ day }}</text>
			</view>
		</view>
		<view class="day-content-wrap">
			<view class="day-content-item" v-for="(item,index) in record" :key="index">
				<spot-item :record="item" />
			</view>
		</view>
	</view>
</template>

<script>
	import SpotItem from './spot-item.vue'
	export default {
		mounted() {
			console.log(this.record, 'record-address-item');
		},
		props: ['record', 'day'],
		components: { SpotItem },
	}
</script>

<style lang="scss" scoped>
	.address-item-wrap-container {
		.day-content-wrap {
			width: 100%;
			box-sizing: border-box;

			.day-content-item {
				margin-bottom: 16rpx;

				&:last-child {
					margin-bottom: 0;
				}
			}
		}

		.day-header-text {
			padding: 12rpx 24rpx;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			position: relative;
			// background: #F6F6F6;
			border-radius: 4rpx 4rpx 4rpx 4rpx;
			overflow: hidden;

			.day-value {
				height: 40rpx;
				font-size: 24rpx;
				font-weight: bold;
				color: rgba(0, 0, 0, 0.9);
				line-height: 40rpx;
			}
		}
	}
</style>